import 'package:flutter/material.dart';
import 'package:flutter_massage/common_lib/extension/ex_widget.dart';
import 'package:flutter_massage/common_lib/index.dart';
import 'package:flutter_massage/common_lib/routers/route.dart';
import 'package:flutter_massage/common_lib/ui/common_component.dart';
import 'package:flutter_massage/generated/assets.dart';
import 'package:flutter_massage/pages/home/home_component.dart';
import 'package:flutter_massage/pages/model/bean.dart';
import 'package:flutter_massage/pages/preject/detail/project_detail_logic.dart';
import 'package:flutter_massage/pages/technician/technician_detail/technician_detail_page.dart';
import 'package:flutter_massage/pages/technician/technician_list/technician_list_page.dart';
import 'package:flutter_massage/pages/technician_album/technician_album_page.dart';
import 'package:flutter_massage/service/index.dart';
import 'package:flutter_massage/values/index.dart';
import 'package:flutter_screenutil/flutter_screenutil.dart';
import 'package:get/get.dart';

class ProjectDetailPage extends GetView<ProjectDetailLogic> {
  const ProjectDetailPage(this.bean, {super.key});

  final ProjectBean bean;

  @override
  Widget build(BuildContext context) {
    return BaseScaffold(
      titleStr: '项目详情',
      scaffoldBackgroundColor: AppColors.grayF8,
      child: GetBuilder<ProjectDetailLogic>(
        init: ProjectDetailLogic(bean),
        assignId: true,
        builder: (logic) {
          return ListView(
            children: [
              _buildImage(),
              _buildInfo(),
              _buildTechnician().paddingTop(16.w),
              _buildAlbum().paddingTop(18.w),
              _buildDescription().paddingTop(16.w),
            ],
          );
        },
      ),
    );
  }

  Widget _buildImage() {
    return FractionallySizedBox(
      widthFactor: 1,
      child: AspectRatio(
          aspectRatio: 1,
          child: ImageWidget.url(
            bean.itemImage ?? '',
            fit: BoxFit.cover,
          )),
    );
  }

  Widget _buildCarousel() => Obx(() {
        return CarouselWidget(
          items: bean.itemPics ?? [],
          boxFit: BoxFit.cover,
          currentIndex: controller.currentIndex.value,
          onPageChanged: (index, _) => controller.currentIndex.value = index,
        );
      });

  Widget _buildInfo() {
    return Container(
      decoration: CommonDecoration.getRadius(bottomLeft: 8.w, bottomRight: 8.w, bg: Colors.white),
      padding: EdgeInsets.symmetric(horizontal: 12.w),
      child: Column(
        crossAxisAlignment: CrossAxisAlignment.start,
        children: [
          Row(
            children: [
              Row(
                children: [
                  TextWidget.oneLine(
                    text: bean.itemName ?? '',
                    fontSize: 16,
                    color: AppColors.textLevelOne,
                    fontWeight: FontWeight.bold,
                  ).flexible(),
                  Assets.svgIconDuration.toSvg(width: 12.w).paddingLeft(12.w),
                  TextWidget.oneLine(text: bean.itemTime ?? '', fontSize: 12, color: AppColors.textLevelTwo)
                      .paddingLeft(4.w),
                ],
              ).expanded(),
              TextWidget.oneLine(
                text: '超${bean.chooseNum ?? 0}人选择',
                fontSize: 10,
                color: AppColors.textLevelTwo,
                fontWeight: FontWeight.bold,
              )
            ],
          ).paddingTop(12.w),
          Row(
            children: [
              TextWidget.oneLine(
                text: '¥ ${bean.itemPrice.removeYuan()}',
                fontSize: 18,
                color: AppColors.primaryOrange,
                fontWeight: FontWeight.bold,
              ),
              TextWidget.oneLine(
                text: '￥${bean.itemOldPrice.removeYuan()}',
                fontSize: 12,
                color: AppColors.textLevelTwo,
                style: const TextStyle(decoration: TextDecoration.lineThrough),
              ).paddingLeft(8.w),
            ],
          ).paddingTop(4.w),
          TextWidget.oneLine(
            text: bean.itemLabel ?? '',
            fontSize: 11,
            color: AppColors.textLevelTwo,
            fontWeight: FontWeight.bold,
          ).padding(top: 6.w, bottom: 12.w),
        ],
      ),
    );
  }

  Widget _buildTechnician() {
    List<TechnicianBean> lists = bean.itemTechnicians ?? [];
    return Column(
      crossAxisAlignment: CrossAxisAlignment.start,
      children: [
        const CommonTitleComponent(title: '项目技师'),
        ...lists.map((e) => CommonTechnicianItem(e, showLocation: true).paddingTop(12.w)).toList(),
        Row(
          children: [
            Text.rich(
              TextSpan(
                text: '附近有',
                children: [
                  TextSpan(
                    text: (bean.nearTechnicianNum ?? 0).toString(),
                    style: const TextStyle(color: AppColors.primaryGreen),
                  ),
                  const TextSpan(text: '位技师可为您服务'),
                ],
                style: const TextStyle(fontSize: 12, color: AppColors.textLevelTwo, fontWeight: FontWeight.bold),
              ),
            ).expanded(),
            ButtonWidget.textIcon(
              '更多',
              Assets.svgArrowRightGray.toSvg(width: 8.w, color: AppColors.textLevelTwo),
              fontSize: 12,
              textColor: AppColors.textLevelTwo,
              fontWeight: FontWeight.bold,
              spacing: 4.w,
              hasInkWell: false,
              onTap: () async {
                var result = await JsonService.getTechnicianList();
                CommonRoute.open(TechnicianListPage(result));
              },
            ),
          ],
        ).paddingTop(12.w),
      ],
    ).paddingHorizontal(12.w);
  }

  Widget _buildAlbum() {
    List<TechnicianAlbumBean> lists = bean.technicianAlbum ?? [];
    if (lists.isEmpty) return Container();
    return Column(
      crossAxisAlignment: CrossAxisAlignment.start,
      children: [
        CommonTitleComponent(
          title: '技师相册',
          onTapAll: () => CommonRoute.open(TechnicianAlbumPage(lists)),
        ),
        CommonMargin.height(12.w),
        SizedBox(
          height: 70.w,
          child: ListView.separated(
            scrollDirection: Axis.horizontal,
            itemCount: lists.length,
            separatorBuilder: (BuildContext context, int index) => CommonMargin.width(12.w),
            itemBuilder: (BuildContext context, int index) {
              return ImageWidget.url(
                lists[index].image ?? '',
                width: 70.w,
                height: 70.w,
                radius: 4.w,
              );
            },
          ),
        ),
      ],
    ).paddingHorizontal(12.w);
  }

  Widget _buildDescription() {
    return Column(
      crossAxisAlignment: CrossAxisAlignment.start,
      children: [
        const CommonTitleComponent(title: '项目说明'),
        CommonMargin.height(8.w),
        _buildCarousel(),
      ],
    ).paddingHorizontal(12.w);
  }
}

class CommonTechnicianItem extends StatelessWidget {
  const CommonTechnicianItem(this.bean, {super.key, this.showLocation = false});

  final bool showLocation;
  final TechnicianBean bean;

  @override
  Widget build(BuildContext context) {
    return ButtonWidget(
      onTap: () => CommonRoute.open(TechnicianDetailPage(bean)),
      child: Container(
        decoration: CommonDecoration.getRadius(bg: Colors.white, all: 8.w),
        child: CommonListItemScaffold(
          contentPadding: EdgeInsets.fromLTRB(6.w, 6.w, 12.w, 6.w),
          left: ImageWidget.url(
            bean.header ?? '',
            width: 74.w,
            height: 74.w,
            radius: 74.w,
          ),
          center: CommonMargin.width(12.w),
          right: Column(
            crossAxisAlignment: CrossAxisAlignment.start,
            children: [
              Row(
                children: [
                  TextWidget.oneLine(
                    text: bean.name ?? '',
                    fontSize: 16,
                    color: AppColors.textLevelOne,
                    fontWeight: FontWeight.bold,
                  ).expanded(),
                  if (showLocation)
                    ButtonWidget.iconText(
                      Assets.svgLocationGreen.toSvg(width: 13.w),
                      bean.distance ?? '',
                      fontSize: 13,
                      textColor: AppColors.primaryGreen,
                      spacing: 2.w,
                      hasInkWell: false,
                    ),
                ],
              ),
              Row(
                children: [
                  Text.rich(
                    TextSpan(
                      text: '评分：',
                      children: [
                        TextSpan(text: bean.score ?? '', style: const TextStyle(color: AppColors.primaryOrange)),
                      ],
                      style: const TextStyle(fontSize: 12, color: AppColors.textLevelTwo, fontWeight: FontWeight.bold),
                    ),
                  ),
                  CommonMargin.width(24.w),
                  Text.rich(
                    TextSpan(
                      text: '已服务人次：',
                      children: [
                        TextSpan(
                          text: (bean.servedNum ?? 0).toString(),
                          style: const TextStyle(color: AppColors.primaryOrange),
                        ),
                      ],
                      style: const TextStyle(fontSize: 12, color: AppColors.textLevelTwo, fontWeight: FontWeight.bold),
                    ),
                  ).flexible(),
                ],
              ).paddingTop(6.w),
              TextWidget.oneLine(
                text: (bean.labels ?? []).join('、'),
                fontSize: 11,
                color: AppColors.textLevelTwo,
                fontWeight: FontWeight.bold,
              ).paddingTop(8.w),
            ],
          ).expanded(),
        ),
      ),
    );
  }
}
